<style scoped lang="scss">
::v-deep .el-step__icon.is-text {
  border: none !important;
  height: 50px;
}

::v-deep .el-step__main {
  padding-top: 11px;
  padding-left: 30px !important;
}

.hex-form-inf-icon {
  color: #347de1;
}

.dashboard-editor-container {
  padding: 18px 22px 22px 22px;
  background-color: rgb(240, 242, 245);
  margin-bottom: 80px;
}

.form-operator-button {
  background-color: #fff;
  position: fixed;
  width: 100%;
  left: 0px;
  right: 0;
  bottom: 33px;
  height: 64px;
  line-height: 64px;
  text-align: right;
  box-shadow: 0 -1px 2px 0 rgba(0, 0, 0, 0.05);
  z-index: 999;
}

.hex-form-inf {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  cursor: pointer;
  margin-right: 40px;
  position: relative;
  min-height: 33px;
  margin-left: 60px;
  line-height: 33px;
  color: #347de1;
}

.hex-form-inf-content {
  font-size: 14px;
  font-weight: 500;
  display: none;
}

.hex-form-inf-icon {
  font-size: 20px;
  margin-top: 5px;
  position: absolute;
  right: 0px;
}

.upload-demo {
  padding-right: 40px;
}

.hex-form-inf .hex-form-inf-content-show {
  padding: 0 4%;
  background-color: #f7f9fa;
  border: 1px solid #347de1;
  border-radius: 8px;
}

.el-table__header {
  width: 100% !important;
}

.el-table__body {
  width: 100% !important;
}
</style>

<template>
  <div class="dashboard-container">
    <div class="dashboard-editor-container">
      <el-card class="box-card" v-if="crud.optPageShow.listPage">
        <div slot="header" class="clearfix">
          <span>定时任务定义列表</span>
        </div>
        <!--工具栏-->
        <div class="head-container">
          <crudOperation :permission="permission"/>
        </div>
        <!--表格渲染-->
        <el-table ref="table" v-loading="crud.loading" v-if="!this.addDialog" :data="crud.data" style="width: 100%;"
                  @select="crud.selectChange" @select-all="crud.selectAllChange"
                  @selection-change="crud.selectionChangeHandler" @filter-change="crud.handleFilterChange"
                  @row-dblclick="editClick" @cell-mouse-enter="showTooltip" @cell-mouse-leave="hideTooltip"
                  :header-cell-style="{ background: 'rgba(52, 125, 225, 0.1)', color: '#404248' }" border stripe>
          <el-table-column type="selection" width="55"/>
          <el-table-column v-if="false" prop="pkId" label="id" align="center"/>
          <el-table-column v-if="columns.visible('taskCode')" :show-overflow-tooltip="true" min-width="120"
                           prop="taskCode" label="任务编码"/>
          <el-table-column v-if="columns.visible('taskName')" :show-overflow-tooltip="true" min-width="120"
                           prop="taskName" label="任务名称"/>
          <el-table-column v-if="columns.visible('cronExpress')" :show-overflow-tooltip="true" min-width="100"
                           prop="cronExpress" label="CRON表达式"/>
          <el-table-column v-if="columns.visible('shellPath')" :show-overflow-tooltip="true" prop="shellPath"
                           min-width="160" label="shell文件"/>
          <el-table-column v-if="columns.visible('extParam')" :show-overflow-tooltip="true" prop="extParam"
                           min-width="100" label="外部参数"/>
          <el-table-column v-if="columns.visible('batchTag')" :show-overflow-tooltip="true" min-width="100"
                           align="center" prop="batchTag" label="批次标签">
            <template slot-scope="scope">
              <el-tag size="medium" type="success" v-if="scope.row.batchTag!=''&& scope.row.batchTag != null">
                {{ scope.row.batchTag }}
              </el-tag>
            </template>
          </el-table-column>
          <el-table-column v-if="columns.visible('appointAgentName')" :show-overflow-tooltip="true" min-width="120"
                           prop="appointAgentName" label="指定节点"/>
          <el-table-column v-if="columns.visible('startEndDateStr')" min-width="160" prop="startEndDateStr"
                           label="生效日期"/>
          <el-table-column v-if="columns.visible('taskStatus')" prop="taskStatus" label="状态 " min-width="100"
                           :filters="cronTaskDefStatusDict" :filter-method="filterTaskStatus" key="taskStatus"
                           filter-placement="bottom-end" :filter-multiple="false" column-key="taskStatus">
            <template slot-scope="scope">
              <el-tag size="medium" :type="formatterCronTaskDefStatusType(scope.row.taskStatus)">
                {{ formatterCronTaskDefStatus(scope.row.taskStatus) }}
              </el-tag>
            </template>
          </el-table-column>
          <el-table-column v-if="columns.visible('upTs')" :show-overflow-tooltip="true" min-width="160" prop="upTs"
                           label="更新时间">
            <template slot-scope="scope">
              <!-- 悬浮提示 -->
              <el-tooltip placement="bottom-end" v-model="scope.row.showTooltip" :open-delay="500" effect="light"
                          :disabled="!scope.row.showTooltip">
                <!-- 注意 显示单元格浮框时 v-model 和 disabled 属性要一起使用才有效果 -->
                <div slot="content">双击当前行点开详情</div>
                <div>{{ scope.row.upTs }}</div>
              </el-tooltip>
            </template>
          </el-table-column>
        </el-table>
      </el-card>
      <el-card class="box-card" v-if="crud.optPageShow.addPage" style="padding-bottom: 30px">
        <div slot="header" class="clearfix">
          <div class="el-page-header">
            <div class="el-page-header__left" @click="crud.goBack">
              <i class="el-icon-back"></i>
              <div class="el-page-header__title">返回</div>
            </div>
            <div class="el-page-header__content" style="font-size: 15px;">任务编辑</div>
          </div>
        </div>
        <div class="dataFrom" v-if="crud.optPageShow.addPage">
          <el-form ref="form" :model="form" :rules="rules" label-position="left" label-width="200px">
            <el-col :span="4" style="height: 450px;padding: 30px 20px 60px 20px;">
              <el-steps direction="vertical" :active="active">
                <el-step title="基本信息">
                  <template slot="icon">
                    <img v-if="active>=1" src="@images/active.png" alt="" class="activepng">
                    <img v-else src="@images/noactive.png" alt="" class="activepng">
                  </template>
                </el-step>
                <el-step title="配置信息">
                  <template slot="icon">
                    <img v-if="active>=2" src="@images/active.png" alt="" class="activepng">
                    <img v-else src="@images/noactive.png" alt="" class="activepng">
                  </template>
                </el-step>
                <el-step title="CRON表达式">
                  <template slot="icon">
                    <img v-if="active>=3" src="@images/active.png" alt="" class="activepng">
                    <img v-else src="@images/noactive.png" alt="" class="activepng">
                  </template>
                </el-step>
              </el-steps>
            </el-col>
            <el-col :span="20"
                    style="padding: 30px;border-left: 1px solid #EBEEF5;min-height: 360px;background:#F7F9FA">
              <div v-if="active == 0">
                <el-row>
                  <el-col :span="15">
                    <el-form-item label="任务编码" prop="taskCode" style="padding-right: 20%">
                      <el-input v-model.trim="form.taskCode" :disabled="form.pkId != null"/>
                    </el-form-item>
                  </el-col>
                  <el-col :span="9" class="data_from_el-col">
                    <div class="hex-form-inf">
                      <div class="hex-form-inf-content">唯一编码，任务编码</div>
                      <i class="el-icon-info hex-form-inf-icon" @click="onOperInf($event)" data-status="off"></i>
                    </div>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="15">
                    <el-form-item label="任务名称" prop="taskName" style="padding-right: 20%">
                      <el-input v-model.trim="form.taskName"/>
                    </el-form-item>
                  </el-col>
                  <el-col :span="9" class="data_from_el-col">
                    <div class="hex-form-inf">
                      <div class="hex-form-inf-content">唯一编码，任务名称</div>
                      <i class="el-icon-info hex-form-inf-icon" @click="onOperInf($event)" data-status="off"></i>
                    </div>
                  </el-col>
                </el-row>

                <el-row>
                  <el-col :span="15">
                    <el-form-item label="shell文件" prop="shellPath" style="padding-right: 20%">
                      <el-input v-model.trim="form.shellPath"/>
                    </el-form-item>
                  </el-col>
                  <el-col :span="9" class="data_from_el-col">
                    <div class="hex-form-inf">
                      <div class="hex-form-inf-content">shell脚本路径</div>
                      <i class="el-icon-info hex-form-inf-icon" @click="onOperInf($event)" data-status="off"></i>
                    </div>
                  </el-col>
                </el-row>

                <el-row>
                  <el-col :span="15">
                    <el-form-item label="外部参数" style="padding-right: 20%">
                      <el-input v-model="form.extParam"/>
                    </el-form-item>
                  </el-col>
                  <el-col :span="9" class="data_from_el-col">
                    <div class="hex-form-inf">
                      <div class="hex-form-inf-content">shell脚本参数</div>
                      <i class="el-icon-info hex-form-inf-icon" @click="onOperInf($event)" data-status="off"></i>
                    </div>
                  </el-col>
                </el-row>

                <el-row>
                  <el-col :span="15">
                    <el-form-item style="padding-right: 20%" label="是否限定生效日期范围">
                      <el-switch v-model="form.isValidDate" active-value="1" inactive-value="2">
                      </el-switch>
                    </el-form-item>
                  </el-col>
                  <el-col :span="9" class="data_from_el-col">
                    <div class="hex-form-inf">
                      <div class="hex-form-inf-content">是否限制任务的生效时间范围</div>
                      <i class="el-icon-info hex-form-inf-icon" @click="onOperInf($event)" data-status="off"></i>
                    </div>
                  </el-col>
                </el-row>
                <el-row v-if="form.isValidDate==1">
                  <el-col :span="15">
                    <el-form-item style="padding-right: 20%" label="日期范围" prop="startEndDate">
                      <el-date-picker v-model="form.startEndDate" type="daterange"
                                      @change="changeDate(form.startEndDate)" unlink-panels range-separator="至"
                                      start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd"
                                      align="right">
                      </el-date-picker>
                    </el-form-item>
                  </el-col>
                  <el-col :span="9" class="data_from_el-col">
                    <div class="hex-form-inf">
                      <div class="hex-form-inf-content">任务的生效时间范围</div>
                      <i class="el-icon-info hex-form-inf-icon" @click="onOperInf($event)" data-status="off"></i>
                    </div>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="15">
                    <el-form-item label="任务描述" style="padding-right: 10%">
                      <el-input v-model="form.taskDesc" type="textarea" :autosize="{ minRows: 3, maxRows: 5}"
                                placeholder="请输入内容"
                                maxlength="60" show-word-limit style="width: 100%"/>
                    </el-form-item>
                  </el-col>
                  <el-col :span="9" class="data_from_el-col">
                    <div class="hex-form-inf">
                      <div class="hex-form-inf-content">任务的描述，不可超过60个字</div>
                      <i class="el-icon-info hex-form-inf-icon" @click="onOperInf($event)" data-status="off"></i>
                    </div>
                  </el-col>
                </el-row>

                <div class="form-operator-button" style="text-align:center">
                  <el-button type="primary" @click="nextSetp1">下一步</el-button>
                </div>
              </div>
              <div v-if="active == 1">
                <el-row>
                </el-row>
                <el-row>
                  <el-col :span="15">
                    <el-form-item label="指定节点编码" style="padding-right: 20%">
                      <el-select v-model="form.appointAgentCode" filterable placeholder="请选择">
                        <el-option v-for="item in agentCodeOption" :key="item.agentCode" :label="item.agentName"
                                   :value="item.agentCode">
                          <span style="float: left">{{ item.agentCode }} </span>
                          <span style="float: right; color: #8492a6; font-size: 13px">{{ item.agentName }}</span>
                        </el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="9" class="data_from_el-col">
                    <div class="hex-form-inf">
                      <div class="hex-form-inf-content">唯一编码，执行任务的节点编码
                      </div>
                      <i class="el-icon-info hex-form-inf-icon" @click="onOperInf($event)" data-status="off"></i>
                    </div>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="15">
                    <el-form-item label="资源数" style="padding-right: 20%" prop="resNum">
                      <el-input-number v-model="form.resNum" :min="1" :max="100"/>
                    </el-form-item>
                  </el-col>
                  <el-col :span="9" class="data_from_el-col">
                    <div class="hex-form-inf">
                      <div class="hex-form-inf-content">任务所占资源数，默认为5，特殊大作业增大数值
                      </div>
                      <i class="el-icon-info hex-form-inf-icon" @click="onOperInf($event)" data-status="off"></i>
                    </div>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="15">
                    <el-form-item label="预计执行时长(秒)" style="padding-right: 20%" prop="planExecDuration">
                      <el-input-number v-model="form.planExecDuration" :min="0" :max="100000"/>
                    </el-form-item>
                  </el-col>
                  <el-col :span="9" class="data_from_el-col">
                    <div class="hex-form-inf">
                      <div class="hex-form-inf-content">预估任务的执行时间
                      </div>
                      <i class="el-icon-info hex-form-inf-icon" @click="onOperInf($event)" data-status="off"></i>
                    </div>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="15">
                    <el-form-item label="超时时长(秒)" style="padding-right: 20%" prop="overPlanDuration">
                      <el-input-number v-model="form.overPlanDuration" :min="0" :max="100000"/>
                    </el-form-item>
                  </el-col>
                  <el-col :span="9" class="data_from_el-col">
                    <div class="hex-form-inf">
                      <div class="hex-form-inf-content">允许任务超时最大时长
                      </div>
                      <i class="el-icon-info hex-form-inf-icon" @click="onOperInf($event)" data-status="off"></i>
                    </div>
                  </el-col>
                </el-row>

                <div class="form-operator-button" style="text-align:center">
                  <el-button type="primary" @click="lastSetp">上一步</el-button>
                  <el-button type="primary" @click="nextSetp1">下一步</el-button>
                </div>
              </div>
              <div v-if="active == 2">
                <cron v-model="form.cronExpress"></cron>
                <el-row>
                </el-row>
                <div class="form-operator-button" style="text-align:center">
                  <el-button type="primary" @click="lastSetp">上一步</el-button>
                  <el-button type="primary" :loading="crud.status.cu === 2" @click="finish()">完成</el-button>

                </div>
              </div>
            </el-col>
          </el-form>
        </div>

      </el-card>

      <el-card class="box-card" v-if="crud.optPageShow.excelPage" style="padding-bottom: 30px">
        <div slot="header" class="clearfix">
          <div class="el-page-header">
            <div class="el-page-header__left" @click="crud.goBack">
              <i class="el-icon-back"></i>
              <div class="el-page-header__title">返回</div>
            </div>
            <div class="el-page-header__content" style="font-size: 15px;">导入数据</div>
          </div>
        </div>
        <div class="dataFrom" style="width: 400px;border-right: 1px solid #EBEEF5;display: inline-block">
          <el-row>
            <div style="display: inline-block">批次号:</div>
            <div style="display: inline-block;padding-left: 10px">
              <el-input placeholder="请输入批次号" v-model="uploadForm.batchTag" style="width: 310px"/>
            </div>
          </el-row>
          <el-row style="margin-top: 20px;">
            <el-upload ref="upload" action="" class="upload-demo" drag :headers="httpHeaders" :data="uploadForm"
                       :auto-upload="false" multiple :limit="1" :accept="acceptFileType" :on-change="handleUploadChange"
                       :on-exceed="handleExceed">
              <i class="el-icon-upload"></i>
              <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
            </el-upload>
          </el-row>
          <el-row style="margin-top: 10px">
            <p>备注：</p>
            <p>1、只支持上传.xls、.xlsx文件，文件大小不超过1MB</p>
            <p>2、只支持单文件上传</p>
            <p>3、导入数据只获取文件中第一个sheet内数据</p>
            <p>4、上传文件数据列数与字段必须按文档模板填写</p>
            <p>5、非必填项如果未按字段规则填写则系统取默认值</p>
          </el-row>
          <el-row style="margin-top: 10px;text-align: right;margin-right: 40px;">
            <el-button type="warning"><a href="./static/down_cron_task_def_template.xlsx" download="定时任务定义模板">模板下载</a>
            </el-button>
            <el-button type="primary" @click="handlerEventByOk">确定上传</el-button>
          </el-row>
        </div>
        <div style="display: inline-block;width: 666px;position: absolute;padding: 0px 30px">
          <el-input type="textarea" placeholder="导入失败数据" v-model="uploadErrorData" :rows="10"/>
        </div>
      </el-card>

      <CronTaskInf v-if="showDetail" :taskCode="taskCode" ref="cronTaskInfo" :goBack="goBack"/>
    </div>
  </div>
</template>
<script>
import {mapGetters} from 'vuex'
import cron from '@/components/cron/cron'
import CRUD, {presenter, header, form, crud} from '@crud/crud'
import crudOperation from '@crud/extend/cronTask/cronTaskDef/app/CRUD.operation'
import CronTaskInf from '../components'
import appApi from '@/api/app/appInf'
import cronTaskDefApi from '@/api/cronTask/cronTaskDef'

const queryList = [{
  'cloumValue': 'taskCodeFuzzy',
  'cloumName': '任务编码'
}, {
  'cloumValue': 'taskName',
  'cloumName': '任务名称'
}, {
  'cloumValue': 'batchTag',
  'cloumName': '批次标签'
}];
const defaultCrud = CRUD({
  title: '任务定义',
  queryList: queryList,
  url: '/api/cronTaskDef',
  queryOnPresenterCreated: false,
  sort: 'sort,asc',
  crudMethod: {
    ...cronTaskDefApi
  }
})
const defaultForm = {
  pkId: null,
  taskCode: null,
  taskName: null,
  isValidDate: null,
  startEndDateStr: null,
  shellPath: null,
  extParam: null,
  taskDesc: null,
  appointAgentCode: null,
  resNum: 5,
  planExecDuration: 0,
  overPlanDuration: 0,
  cronExpress: null,
  taskStDate: null,
  taskEndDate: null,
  startEndDate: []
}

const tableColumnOptions = [];
export default {
  name: 'appCronDef',
  components: {cron, crudOperation, CronTaskInf},
  mixins: [presenter(defaultCrud), header(), form(defaultForm), crud()],
  dicts: ['task_def_status'],
  filters: {
    formatTime: function (value) {
      if (value != '') {
        return value.slice(0, 19).replace('T', ' ')
      }
    }
  },
  data() {
    let validateCode = (rule, value, callback) => {
      var util = {
        isFigure: function (e) {
          return /^[0-9A-Z_|()=>.-]+$/.test(e);
        }
      }
      if (value == null) {
        callback(new Error("任务编码不能为null！"));
      } else if (!util.isFigure(value)) {
        callback(new Error("只能输入大写英文字母、下划线、分隔符或数字及指定符号(=>.-)"));
      } else {
        cronTaskDefApi.queryByTaskCode(value).then(res => {
          if (res && res.pkId !== this.form.pkId) {
            callback(new Error("任务编码已存在"));
          } else {
            callback()
          }
        })
      }
    };
    let validateName = (rule, value, callback) => {
      var util = {
        isFigure: function (e) {
          return /^[a-zA-Z0-9_\u4e00-\u9fa5-()=>._ ]+$/.test(e);
        }
      }
      if (!util.isFigure(value)) {
        callback(new Error("不能输入特殊字符"));
      } else {
        callback()
      }
    };
    let validateStartEndDate = (rule, value, callback) => {
      if (rule.field === 'startEndDate') {
        if (value === null || value.length === 0) {
          callback(new Error("时间范围不能为空！"));
        } else {
          callback();
        }
      }
    };
    return {
      active: 0,
      execType: '',
      agentCodeOption: [],
      permission: {
        add: ['appCronTaskDef:add'],
        edit: ['appCronTaskDef:edit'],
        del: ['appCronTaskDef:del'],
        enable: ['appCronTaskDef:enable'],
        disable: ['appCronTaskDef:disable'],
        export: ['appCronTaskDef:export'],
        import: ['appCronTaskDef:import'],
      },
      taskCode: null,
      rules: {
        taskCode: [
          {required: true, message: '请输入任务编号', trigger: 'blur'},
          {validator: validateCode, trigger: 'blur'},
        ],
        taskName: [
          {required: true, message: '请输入任务名称', trigger: 'blur'},
          {validator: validateName, trigger: 'blur'},
        ],
        shellPath: [
          {required: true, message: '请输入shell文件路径', trigger: 'blur'},
        ],
        startEndDate: [
          {required: true, validator: validateStartEndDate, tigger: 'blur'}
        ],
        resNum: [
          {required: true, message: '请输入资源数', trigger: 'blur'}
        ],
        planExecDuration: [
          {required: true, message: '请输入预计执行时长(秒)', trigger: 'blur'}
        ],
        overPlanDuration: [
          {required: true, message: '请输入超时时长(秒)', trigger: 'blur'}]
      },
      allColumnsSelected: true,
      allColumnsSelectedIndeterminate: false,
      checkAll: true,
      tableColumns: tableColumnOptions,
      isIndeterminate: true,
      qryParam: '',
      qryCloum: '',
      showQryParamFlag: false,
      addDialog: false,
      zones: ['linux', 'windows', 'ios'],
      uuidA: '',
      uploadTemplateDialog: false,
      fileList: [],
      uploadLoading: false,
      acceptFileType: '.xls,.xlsx',
      uploadUrl: '/api/cronTaskDef/upload',
      httpHeaders: {
        'Authorization': ''
      },
      uploadErrorData: null,
      uploadForm: {batchTag: null},
      downLoadLoading: '',
      showDetail: false,
      taskForm: {taskStDate: null, taskEndDate: null},
      cronTaskDefStatusDict: [],
      cronTaskDefDict: []
    }
  },
  computed: {
    ...mapGetters([
      'token'
    ])
  },
  created() {
    this.crud.optPageShow.listPage = true;
    this.crud.optPageShow.addPage = false;
    this.crud.optPageShow.excelPage = false;
    this.active = 0;
    this.initData();
    this.httpHeaders.Authorization = this.token;
    this.cronTaskDefDict = this.dict.task_def_status;
  },
  watch: {
    cronTaskDefDict() {
      this.$nextTick(() => {
        this.cronTaskDefDict.forEach(item => {
          var obj = {
            text: item.label,
            value: item.value
          }
          this.cronTaskDefStatusDict.push(obj);
        })
      })
    }
  },
  methods: {
    // 新增前
    [CRUD.HOOK.beforeToAdd](crud) {
      this.active = 0;
      //初始化节点编码
      this.initAgentCodes();
      crud.form.startEndDate = null;
    },
    // 编辑应用前
    [CRUD.HOOK.beforeToEdit](crud) {
      this.active = 0;
      let arrayObj = new Array();
      if (crud.form.taskStDate != null) {
        arrayObj.push(new Date(crud.form.taskStDate), new Date(crud.form.taskEndDate));
      }
      this.$set(crud.form, 'startEndDate', arrayObj);
      //初始化节点编码
      this.initAgentCodes();
    },
    //进入时显示提示框
    showTooltip(row) {
      row.showTooltip = true;
    },
    //退出时隐藏提示框
    hideTooltip(row) {
      row.showTooltip = false;
    },
    initAgentCodes() {
      appApi.findNodeByCurrentApp()
        .then(res => {
          this.agentCodeOption = res;
        });
    },
    formatterBatchTag(val) {
      return val;
    },
    onOperInf: function (e) {
      let status = e.target.getAttribute('data-status');
      let previousNode = e.target.previousElementSibling;
      if ("off" == status) {
        previousNode.setAttribute('class', 'hex-form-inf-content-show');
        e.target.setAttribute('data-status', 'on');
      } else {
        previousNode.setAttribute('class', 'hex-form-inf-content');
        e.target.setAttribute('data-status', 'off');
      }
    },
    editClick(row, column, event) {
      this.showDetail = true;
      this.crud.optPageShow.listPage = false;
      this.taskCode = row.taskCode;
    },
    filterTaskStatus(value, row) {
      return row.taskStatus === value;
    },
    formatterCronTaskDefStatusType(val) {
      const type = ['info', 'success', 'warning']
      return type[val]
    },
    formatterCronTaskDefStatus(val) {
      return this.dict.label.task_def_status[val]
    },
    filterExecType(value, row) {
      return row.execType === value;
    },
    execTypeFormatter(row, column) {
      return this.dict.label.exec_type[row.execType]
    },
    nextSetp1() {
      this.$refs['form'].validate(valid => {
        if (!valid) {
          return
        }
        this.active++;
      })
    },
    nextSetp2() {
      this.active++;
    },
    lastSetp() {
      this.active--;
    },
    finish() {
      this.crud.submitCU();
    },
    showQryParams() {
      this.showQryParamFlag = true
    },
    hideQryParams() {
      this.showQryParamFlag = false
    },
    initData() {
      //跳转时的当前页 在main.js的全局变量
      let p = this.$root.p
      //alert(p);
      if (p != 1) {
        this.crud.pageChangeHandler(p);
        this.$root.p = 1;
      } else {
        this.crud.toQuery();
      }
    },
    add() {
      this.addDialog = true
    },
    backFun() {
      this.addDialog = false;
    },
    handlerEventByOk() {
      if (this.fileList.length > 0) {
        this.uploadLoading = true;
        const formData = new FormData();
        formData.append('file', this.fileList[0].raw);
        formData.append("batchTag", this.uploadForm.batchTag);
        const appInfo = JSON.parse(localStorage.getItem('appInfo'))
        formData.append("appCode", appInfo.appCode);
        this.crud.doupload(formData);
      } else {
        this.$notify.error({
          title: '错误',
          message: '请选择导入的文件!'
        });
      }
      ;
    },
    [CRUD.HOOK.afterUpload](crud, rsp) {
      if (rsp.status === true) {
        this.$notify.success({
          title: '提示',
          message: '导入成功!'
        });
        this.crud.goBack();
        this.crud.toQuery();
      } else {
        this.uploadErrorData = rsp.message;
        this.$refs['upload'].clearFiles();
        this.$notify.error({
          title: '提示',
          message: '导入失败!'
        });
      }
    },
    handleExceed(files, fileList) {
      this.$notify.error({
        title: '提示',
        message: '只支持单个文件上传!'
      });
    },
    handleUploadChange(file, fileList) {
      this.fileList = fileList;
      var fileName = file.name.substring(file.name.lastIndexOf('.') + 1);
      if (fileName != 'xlsx' && fileName != 'xls') {
        this.beforUploadError("文件类型不是excel文件!");
        this.$refs['upload'].clearFiles();
        return false;
      }
      //读取文件大小
      var fileSize = file.size;
      if (fileSize > 1048576) {
        this.beforUploadError("选择的文件大小不能超过1M");
        this.$refs['upload'].clearFiles();
        return false;
      }
      if (this.uploadForm.batchTag == null || this.uploadForm.batchTag == '') {
        this.uploadForm.batchTag = this.$moment(new Date()).utcOffset(480).format("YYYY-MM-DD");
      }
      return true;
    },
    beforUploadError(msg) {
      this.uploadTemplateDialog = false;
      this.$notify.error({
        title: '错误',
        message: msg
      });
    },
    goBack() {
      this.crud.optPageShow.listPage = true;
      this.showDetail = false;
      this.crud.refresh();
    },
    changeDate(param) {
      if (param == null) {
        this.crud.form.startEndDateStr = null;
        this.crud.form.taskEndDate = null;
        this.crud.form.taskStDate = null;
      }
    }
  }
}
</script>
